<template>
  <div>
    <el-card>
      <el-page-header icon="" title="高校教学考试成绩管理系统">
        <template #content>
          <span class="text-large font-600 mr-3">我的课程</span>
        </template>
      </el-page-header>

      <el-table :data="tableData" style="width: 100%" stripe v-loading="loading">
        <el-table-column prop="courseid" label="课程编号" />
        <el-table-column prop="coursename" label="课程名称" />
        <el-table-column prop="name" label="任课教师" />
        <el-table-column prop="major" label="专业" /><el-table-column label="学期">
          <template #default="scope">
            {{ scope.row.term === 20231 ? '2023-2024学年第1学期' : '2023-2024学年第2学期' }}
          </template>
        </el-table-column>
        <el-table-column prop="credit" label="学分" />
      </el-table>
    </el-card>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { useStore } from 'vuex'
import axios from 'axios'
const store = useStore()
const studentData = ref({})
const tableData = ref([])
onMounted(async () => {
  await getStudentData()
  await getTableData()
})
const getStudentData = async () => {
  const res = await axios.get(`/api/student/list/${store.state.userInfo.username}`)
  studentData.value = res.data.data[0]
}
const getTableData = async () => {
  const res1 = await axios.get(`/api/course/studentlist/${studentData.value.major}`)
  const res2 = await axios.get('/api/user/getteacherlist')
  // 将教师工号改为名字
  res1.data.data.forEach((item) => {
    res2.data.data.forEach((i) => {
      if (item['courseteacher'] === i['username']) {
        item['name'] = i['name']
      }
    })
  })
  tableData.value = res1.data.data
}
</script>

<style lang="scss" scoped>
.el-table {
  margin-top: 50px;
}
</style>
